<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>简历列表</title>
    <link rel="stylesheet" href="/resume/css/bootstrap.min.css">
    <link rel="stylesheet" href="/resume/css/bootstrap-table.min.css">
    <link rel="stylesheet" href="/resume/css/toastr.min.css">
    <script src="/resume/js/jquery.min.js"></script>
    <script src="/resume/js/bootstrap.min.js"></script>
    <script src="/resume/js/bootstrap-table.min.js"></script>
    <script src="/resume/js/bootstrap-table-zh-CN.min.js"></script>
    <script src="/resume/js/toastr.min.js"></script>
    <script src="/resume/js/sweetalert.min.js"></script>
</head>
<body>
    <!-- 新增简历模态框（Modal） -->
    <div class="modal fade" id="addResumeModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabel">
                        新增简历信息
                    </h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal" role="form">
                        <div class="form-group">
                            <label for="id" class="col-sm-2 control-label">ID</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="id" disabled>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="name" class="col-sm-2 control-label">姓名</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="name" placeholder="请输入姓名">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="address" class="col-sm-2 control-label">地址</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="address" placeholder="请输入地址">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="phone" class="col-sm-2 control-label">电话</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="phone" placeholder="请输入电话">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                    </button>
                    <button type="button" class="btn btn-primary" id="sumit">
                        提交
                    </button>
                </div>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="row">
            <div class="col-lg-11"><h4>全部简历列表</h4></div>
            <div class="col-lg-1">
                <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#addResumeModal" id="addResumeBtn">新增</button>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <table id="table"></table>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        toastr.options.positionClass = 'toast-top-center';
        $('#table').bootstrapTable({
            method: "post",
            contentType:"application/x-www-form-urlencoded;charset=utf-8",
            url: '/resume/findAll',
            columns: [{
                field: 'id',
                title: 'ID',
                width: '15%'
            }, {
                field: 'name',
                title: '姓名',
                width: '15%'
            }, {
                field: 'address',
                title: '地址',
                width: '15%'
            },{
                field: 'phone',
                title: '电话',
                width: '15%'
            },{
                field: 'operator',
                title: '操作',
                align: 'center',
                valign: 'middle',
                width: '40%',
                formatter: function (value, row, index) {
                    return '<a href="#editProject" data-toggle="modal" title="编辑">' +
                        '<i class="glyphicon glyphicon-pencil"></i> ' +
                        '</a>'+
                        '<a href="javascript:void(0)" title="删除">' +
                        '<i class="glyphicon glyphicon-trash text-danger"></i> ' +
                        '</a>';
                },
                events: {
                    'click a[title=删除]': function (e, value, row, index) {
                        swal({
                            title: "请确认是否删除？",
                            icon: "warning",
                            buttons: {
                                cancel: {
                                    text: "取消",
                                    visible: true,
                                    closeModal: true
                                },
                                confirm: {
                                    text: "删除",
                                    visible: true,
                                    closeModal: true
                                }
                            },
                            dangerMode: true,
                        }).then((willDelete) => {
                            if (willDelete) {
                                $.ajax({
                                    type: "POST",
                                    url: "/resume/deleteByID",
                                    data: {id: row.id},
                                    dataType: "json",
                                    success: function(msg){
                                        if(msg.code == "0") {
                                            $('#table').bootstrapTable('refresh');
                                            toastr.success('删除成功!');
                                        }
                                    }
                                });
                            }
                        });
                    },
                    'click a[title=编辑]': function (e, value, row, index) {
                        $("#addResumeModal").modal('show');
                        $("#myModalLabel").text("修改简历信息");
                        $($("#id").parents("div").get(1)).show();
                        $("#id").val(row.id);
                        $("#name").val(row.name);
                        $("#address").val(row.address);
                        $("#phone").val(row.phone);
                    },
                }
            }]
        });
        $("#addResumeBtn").on("click",function () {
            $("#myModalLabel").text("新增简历信息");
            $($("#id").parents("div").get(1)).hide();
            $("#id").val("");
            $("#name").val("");
            $("#address").val("");
            $("#phone").val("");
        });
        $("#sumit").on("click",function () {
            var param = new Object();
            if($("#id").val()) {
                param.id = $("#id").val();
            }
            //非空校验
            var name = $("#name");
            if(name.val()) {
                $(name.parents("div").get(1)).removeClass("has-error");
            } else {
                $(name.parents("div").get(1)).addClass("has-error");
                return;
            }
            param.name = name.val();
            var address = $("#address");
            if(address.val()) {
                $(address.parents("div").get(1)).removeClass("has-error");
            } else {
                $(address.parents("div").get(1)).addClass("has-error");
                return;
            }
            param.address = address.val();
            var phone = $("#phone");
            if(phone.val()) {
                $(phone.parents("div").get(1)).removeClass("has-error");
            } else {
                $(phone.parents("div").get(1)).addClass("has-error");
                return;
            }
            param.phone = phone.val();
            //提交到后台
            $.ajax({
                type: "POST",
                url: "/resume/saveOrUpdate",
                data: param,
                dataType: "json",
                success: function(msg){
                    if(msg.code == "0") {
                        $("#addResumeModal").modal('hide');
                        $('#table').bootstrapTable('refresh');
                        toastr.success('操作成功!');
                    }
                }
            });
        });
    </script>
</body>
</html>